import { defineComponent } from 'vue';

import Fasr from './Fasr.vue';
import WithDrawer from './WithDrawer.vue';
// import AlternativeLabels from './AlternativeLabels.vue';
// import Coloring from './Coloring.vue';
// import Contracted from './Contracted.vue';
// import Dark from './Dark.vue';
// import HeaderClass from './HeaderClass.vue';
// import LinearNavigation from './LinearNavigation.vue';
// import MessageSlot from './MessageSlot.vue';
// import NonLinearNavigation from './NonLinearNavigation.vue';
// import Prefix from './Prefix.vue';
// import StepError from './StepError.vue';
// import TypeHorizontal from './TypeHorizontal.vue';
// import TypeVertical from './TypeVertical.vue';

export default defineComponent({
  name: 'App',
  props: {},
  emits: [],

  setup(props, { attrs, emit, expose, slots }) {
    expose({});
    return () => {
      return (
        <div class='block'>
          <div class='block-'>
            <h5 class='title'>WithDrawer</h5>
            <WithDrawer />
          </div>
          <div class='block-'>
            <h5 class='title'>Fasr</h5>
            <Fasr />
          </div>
          {/* <div class='block-'>
            <h5 class='title'>AlternativeLabels</h5>
            <AlternativeLabels />
          </div>
          <div class='block-'>
            <h5 class='title'>Coloring</h5>
            <Coloring />
          </div>
          <div class='block-'>
            <h5 class='title'>Contracted</h5>
            <Contracted />
          </div>
          <div class='block-'>
            <h5 class='title'>Dark</h5>
            <Dark />
          </div>
          <div class='block-'>
            <h5 class='title'>HeaderClass</h5>
            <HeaderClass />
          </div>
          <div class='block-'>
            <h5 class='title'>LinearNavigation</h5>
            <LinearNavigation />
          </div>
          <div class='block-'>
            <h5 class='title'>MessageSlot</h5>
            <MessageSlot />
          </div>
          <div class='block-'>
            <h5 class='title'>NonLinearNavigation</h5>
            <NonLinearNavigation />
          </div>
          <div class='block-'>
            <h5 class='title'>Prefix</h5>
            <Prefix />
          </div>
          <div class='block-'>
            <h5 class='title'>StepError</h5>
            <StepError />
          </div>
          <div class='block-'>
            <h5 class='title'>TypeHorizontal</h5>
            <TypeHorizontal />
          </div>
          <div class='block-'>
            <h5 class='title'>TypeVertical</h5>
            <TypeVertical />
          </div> */}
        </div>
      );
    };
  },
});
